<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>首页</title>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		<link rel="stylesheet" type="text/css" href="css/index_center.css" />
		<script src="js/index.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div id="container">
			<!-- 1.存放网页所有内容 -->
			<!-- 2.将头部划分好区域 -->
			<div id="header">
				
				<!--头部分四部分 -->
				<!-- 4、确定每部分的位置-->
				<!-- 5.确定上下两部分的位置 -->
				<!-- 6.确定 上不封中3个div的位置-->
				<!-- 7.给头部上部分设置背景图 -->
				<!-- 8.在logo部分添加链接 -->
				<!-- 9.将购物车的代码复制到对应结构中，注意位置的变化 -->
				<!-- 10. 欢迎词部分-->
				<!-- 11.导航部分 将背景图放上-->
				<!-- 12.添加导航结构 -->
				<!-- 13.将导航的字体 模板显示  去掉点 设置a链接的宽度和高度 设置对其方式-->
				<!-- 15. 使用js控制时间-->
				<!-- 16.搜索部分 -->
				<!-- 17. 给搜索绑定事件-->
				<div id="header-top">
					<div id="logo">
						<a href="#"></a>
					</div>
					<div id="car">
						<!-- 购物车 -->
						<ul>
							<li><a href="#" class="pic"></a></li>
							<li><a href="#" class="text">购物车</a></li>
							<li><a href="#" class="pic pic2"></a></li>
							<li><a href="#" class="text">帮助中心</a></li>
							<li><a href="#" class="pic pic3"></a></li>
							<li><a href="#" class="text">加入收藏</a></li>
							<li><a href="#" class="pic pic4"></a></li>
							<li><a href="#" class="text">设为首页</a></li>
							<li><a href="#" class="pic pic5">注册</a></li>
							<li><a href="#" class="pic pic5">登录</a></li>
						</ul>
					</div>
					<div id="welcome">
						<!-- 欢迎文字 -->
						<spen>欢迎回来</spen>
						<spen id="time">2020-09-25 18:11:11</spen>
					</div>
				</div>
				<div id="header-nav">
					<!-- 导航部分 -->
					<ul class="nave">
						<li><a href="#">首　页</a></li>
						<li><a href="#">家用电器</a></li>
						<li><a href="#">手机数码</a></li>
						<li><a href="#">日用百货</a></li>
						<li><a href="#">书籍</a></li>
						<li><a href="#">帮助中心</a></li>
						<li><a href="#">全球资讯</a></li>
						<li><a href="#">免费开店</a></li>
					</ul>
					<ul class="soso">
						<li><input type="text" id="content" value="" /></li>
						<li><input type="button" onclick="soso()" id="" value="" /></li>
					</ul>
				</div>
				<div id="center">
					<div id ="center_left">
						<p class="space"></p>
						<!--左边的区域 -->
						<div class="content">
							<h3><a href="#">家用电器</a></h3>
							<ul>
								<li><a href="#">大家电</a></li>
								<li><a href="#">洗衣机</a></li>
								<li><a href="#">平板电视</a></li>
								<li><a href="#">电热水器</a></li>
								<li><a href="#">家庭音响</a></li>
								<li><a href="#">热水器</a></li>
								<li><a href="#">空调冰箱</a></li>
								<li><a href="#">冷柜</a></li>
								<li><a href="#">DVD</a></li>
								<li><a href="#">电视附件</a></li>
								<li><a href="#">电燃气灶</a></li>
								<li><a href="#">家电下乡</a></li>
								<li><a href="#">家电服务</a></li>
								<li><a href="#">电饭煲</a></li>
								<li><a href="#">摄像机</a></li>
							</ul>
						</div>
						<!--左边的区域 -->
						<div class="content">
							<h3><a href="#">家用电器</a></h3>
							<ul>
								<li><a href="#">大家电</a></li>
								<li><a href="#">洗衣机</a></li>
								<li><a href="#">平板电视</a></li>
								<li><a href="#">电热水器</a></li>
								<li><a href="#">家庭音响</a></li>
								<li><a href="#">热水器</a></li>
								<li><a href="#">空调冰箱</a></li>
								<li><a href="#">冷柜</a></li>
								<li><a href="#">DVD</a></li>
								<li><a href="#">电视附件</a></li>
								<li><a href="#">电燃气灶</a></li>
								<li><a href="#">家电下乡</a></li>
								<li><a href="#">家电服务</a></li>
								<li><a href="#">电饭煲</a></li>
								<li><a href="#">摄像机</a></li>
							</ul>
						</div>
						<!--左边的区域 -->
						<div class="content">
							<h3><a href="#">家用电器</a></h3>
							<ul>
								<li><a href="#">大家电</a></li>
								<li><a href="#">洗衣机</a></li>
								<li><a href="#">平板电视</a></li>
								<li><a href="#">电热水器</a></li>
								<li><a href="#">家庭音响</a></li>
								<li><a href="#">热水器</a></li>
								<li><a href="#">空调冰箱</a></li>
								<li><a href="#">冷柜</a></li>
								<li><a href="#">DVD</a></li>
								<li><a href="#">电视附件</a></li>
								<li><a href="#">电燃气灶</a></li>
								<li><a href="#">家电下乡</a></li>
								<li><a href="#">家电服务</a></li>
								<li><a href="#">电饭煲</a></li>
								<li><a href="#">摄像机</a></li>
							</ul>
						</div>
						<!--左边的区域 -->
						<div class="content">
							<h3><a href="#">家用电器</a></h3>
							<ul>
								<li><a href="#">大家电</a></li>
								<li><a href="#">洗衣机</a></li>
								<li><a href="#">平板电视</a></li>
								<li><a href="#">电热水器</a></li>
								<li><a href="#">家庭音响</a></li>
								<li><a href="#">热水器</a></li>
								<li><a href="#">空调冰箱</a></li>
								<li><a href="#">冷柜</a></li>
								<li><a href="#">DVD</a></li>
								<li><a href="#">电视附件</a></li>
								<li><a href="#">电燃气灶</a></li>
								<li><a href="#">家电下乡</a></li>
								<li><a href="#">家电服务</a></li>
								<li><a href="#">电饭煲</a></li>
								<li><a href="#">摄像机</a></li>
							</ul>
						</div>
					</div>
					<div id="center_mid">
						<!--中间部分-->
						<div id="top-ad">
							<ul id="imgs">
								<li><a href="#"><img src="img/images/ad-02.jpg" alt=""></a></li>
								<li><a href="#"><img src="img/ad-01.jpg" alt=""></a></li>
								<li><a href="#"><img src="img/images/ad-03.jpg" alt=""></a></li>
								<li><a href="#"><img src="img/images/ad-04.jpg" alt=""></a></li>
							</ul>
							<ul class="num" id="nums">
								<li>1</li>
								<li>2</li>
								<li>3</li>
								<li>4</li>
							</ul>
						</div>
					</div>
					<div id="center_right">
						<!--右边部分 -->
					</div>
				</div>
				
			</div>
		</div>
	</body>
</html> 
